<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>宣传培训查询</title>
		<meta http-equiv="Pragma" CONTENT="no-cache">
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<meta name="renderer" content="webkit">
		<link rel="stylesheet" href="${cxt!}/sb/plugins/ztree/css/zTreeStyle/zTreeStyle.css" type="text/css">
		<%include("/common/include.html"){}%>
		<style type="text/css">
		.textbox {
			padding-right: 0px;
			background: url("${cxt !}/sb/themes/insdep/images/combo_arrow.png")
				no-repeat scroll right center transparent;
		}
		</style>
	</head>
	
	<body class="easyui-layout">
			<div data-options="region:'north',split: true,title:'快速查询'" style="height:200px;padding:10px;" >
				<form id="queryByCustomForm"  method="post">
					
					<div style="margin-bottom: 10px;float:left;margin-right: 10px;">
						<label class="label-top" style="width: 100%; display: block;">最早日期：</label>
						<input name="minTime" id="minTime" value='${startTime !}' class="easyui-datebox theme-textbox-radius" style="height:32px;width:212px;text-align:center"
							data-options="editable: false,icons:[{
		                        iconCls:'icon-clear',
		                        handler: function(e){
		                            $(e.data.target).datetimespinner('clear');
		                        }
		                    }]"/>
					</div>
					
					<div style="margin-bottom: 10px;float:left;margin-right: 10px;">
						<label class="label-top" style="width: 100%; display: block;">最晚日期：</label>
						<input name="maxTime" id="maxTime" value='${date()}' class="easyui-datebox theme-textbox-radius" style="height:32px;width:212px;text-align:center"
							data-options="editable: false,icons:[{
		                        iconCls:'icon-clear',
		                        handler: function(e){
		                            $(e.data.target).datetimespinner('clear');
		                        }
		                    }]"/>
					</div>
					<div style="margin-bottom: 10px;float:left;margin-right: 10px;">
						<label class="label-top" style="width: 100%; display: block;">店面名称：</label>
						<input id="organEmployee" type="text" readonly style="width: 200px; height: 30px; padding-left: 10px;border-radius:3px" onclick="showMenuEmployee(); return false;" class="textbox" value="${organization.name! }"/>
						<input name="_query.organIds" id="organIdsEmployee" value="${organization.ids! }" type="hidden">
					</div>
					<div style="margin-bottom: 10px;float:left;margin-right: 10px;">
						<label class="label-top" style="width: 100%; display: block;">搜索</label>
						<a href="#" onclick="queryCustomer()" class="easyui-linkbutton" data-options="iconCls:'icon-search'" style="height:32px;width:212px;text-align:center">搜索</a>
					</div>
					<div style="margin-bottom: 10px;float:left;margin-top: 16px;margin-right: 10px;">
						<a href="#" onclick='customerInfo_xls()' class="easyui-linkbutton" data-options="iconCls:'icon-pageexcel'" style="width:212px">导出</a>
					</div>
				</form>		
			</div>
			
			<div data-options="region:'center',border: false" style="overflow-x:hidden;">
			<table id="propaganda"></table>
			</div>
		<div id="menuContentEmployee" class="menuContentEmployee" style="display: none; position: absolute;z-index: 10;">
			<ul id="organSelectTreeEmployee" class="ztree" style="margin-top: 0;width: 200px;"></ul>
		</div>
	</body>
	
	<script type="text/javascript">
		var $form = $("#queryByCustomForm");
		
		$(document).ready(function (){
			var $form_div = $("#queryByCustomForm div");
			winResize($form_div);
			$(window).resize(function(){//当调整浏览器窗口的大小时，发生 resize 事件
				winResize($form_div);
			});
			query();
		});
		function queryCustomer(){
			query();
		}
		function customerInfo_xls()
		{
			var organIds = $("#organIdsEmployee").val();
			var minTime = $("#minTime").val();
			var maxTime = $("#maxTime").val();
			
			var url = "${cxt!}/spropagandaTraining/excel?organIds=" + organIds + "&minTime=" + minTime+"&maxTime="+maxTime;
			window.location.href = url;
		}
		function initTableTitle(){
			var name = $("#organEmployee").val();
			return name;
		}
		function query(){
			var name = initTableTitle();
			$("#propaganda").datagrid({
				 title:name,
				queryParams:sy.serializeObject($form),
				singleSelect: true,
				
				rownumbers: true, //显示序号
				pagination: true,
				pageSize: 10,
// 				toolbar: '#tb',
				url:'spropagandaTraining/queryPropaganda',
				collapsible: true,
				columns:[[	
							{field:'organname',title:'机构名称',width:'7%',align:'center'},
					  		{field:'time',title:'活动时间',width:'7%',align:'center'},
					  		{field:'place',title:'活动地点',width:'7%',align:'center'},
					  		{field:'personnel',title:'参加人员',width:'40%',align:'center'},
					  		{field:'goods',title:'宣传册数量',width:'7%',align:'center'},
					  		{field:'way',title:'活动方式',width:'7%',align:'center'},
					  		{field:'propagandas',title:'宣传内容',width:'7%',align:'center'},
				]]
			});
		}
	</script>
	
	<!-- 树形图 -->
	<script type="text/javascript">
		var organIdsEmployee=$('#organIdsEmployee').val();
		var settingEmployee = {
			async : {
				enable : true,
				url : '${cxt!}/common/getOrgenTree',
				autoParam : [ "id=ids" ],//, "name=n", "level=lv"
				otherParam : {
					"organIds" : organIdsEmployee
				},
				type : "post"
			},
			view : {
				dblClickExpand : false
			},
			data : {
				simpleData : {
					enable : true
				}
			},
			callback : {
				onClick : onClickEmployee,
				onAsyncSuccess : organTreeOnAsyncSuccessEmployee
			}
		};
		var flagEmployee=0;//只初始化一次标识
		function organTreeOnAsyncSuccessEmployee(event, treeId, msg) {
			if(flagEmployee == 0){
				var organTree = $.fn.zTree.getZTreeObj("organSelectTreeEmployee");
				var nodes = organTree.getNodes();
				flagEmployee = 1;
			}
		}
		function onClickEmployee(e, treeId, treeNode) {
			var zTree = $.fn.zTree.getZTreeObj("organSelectTreeEmployee");
			var path = "";
			var sNodes = zTree.getSelectedNodes();
			if (sNodes.length > 0) {
				var node = sNodes[0].getPath();
				for(var i =0;i<node.length;i++){
					if(i == (node.length-1)){
						path += node[i].name;
					}else{
						path += node[i].name + "/";
					}
				}
			}
			var cityObj = $("#organEmployee");
			cityObj.attr("value", path);
			$("#organIdsEmployee").attr("value", treeNode.id);
			hideMenuEmployee();
		}
		function showMenuEmployee() {
			var cityObj = $("#organEmployee");
			var cityOffset = $("#organEmployee").offset();
			$("#menuContentEmployee").css({
				left : cityOffset.left + "px",
				top : cityOffset.top + cityObj.outerHeight() + "px"
			}).slideDown("fast");
			$("body").bind("mousedown", onBodyDownEmployee);
		}
		function hideMenuEmployee() {
			$("#menuContentEmployee").fadeOut("fast");
			$("body").unbind("mousedown", onBodyDownEmployee);
		}
		function onBodyDownEmployee(event) {
			if (!(event.target.id == "menuBtn" || event.target.id  == "menuContentEmployee" || $(event.target).parents("#menuContentEmployee").length > 0)){
				hideMenuEmployee();
			}
		}
		$.fn.zTree.init($("#organSelectTreeEmployee"), settingEmployee);
	</script>
</html>
